<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>定位</title>
<link rel="stylesheet" href="css/positiondemo.css">
<!--
	定位：指定网页中元素的位置
	由元素的position属性决定
	static：文档流定位。
	relative：相对定位。 参考位置：元素在文档流中位置。偏移后元素在文档流中的位置仍然保留，当前位置(偏移后的位置)会覆盖原来在偏移位置的元素。
	absolute:绝对定位。 1.脱离文档流，不占文档流的位置。2.当父元素是静态定位，参考坐标是浏览器左上角。3.当父元素不是静态定位，参考坐标是父元素的左上角.
  	fixed:固定定位。固定屏幕的固定位置，不随滚动条移动。
  -->
</head>
<body>
<div id="div1"></div>
<div id="div2">
	<div id="div4"></div>
	<div id="div5"></div>
</div>
<div id="div3"></div>
<div id="div6">
	开局一把刀，三秒变土豪。<br>
	开局两张图，故事全靠编。
</div>
<img class="photo"  alt="" src="photo/b1.jpg">
<img class="photo" alt="" src="photo/b1.jpg">
<img class="photo"alt="" src="photo/b1.jpg">
<div class="abc">1</div>
<div class="abc">2</div>
<div class="abc">3</div>
<p id="p1" >PPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPP</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
<p>ppp</p>
</body>
</html>